<template>
	<view class="container">
		<view class="box">
			<view class="register_txt tac">
				个人实名认证
			</view>
			<view class="desc">认证信息将用于平台服务，与账号唯一绑定无法解除绑定。我们会对信息进行严格保密。</view>
			<u-form labelPosition="left" :model="ruleForm" :rules="rules" labelWidth="80" ref="uForm" class="uForm"
				:errorType="errorType" :labelStyle="labelStyle">
				<u-form-item label="" prop="account" borderBottom>
					<u-input v-model="ruleForm.account" placeholder="填写真实姓名" border="none">
					</u-input>
				</u-form-item>
				<u-form-item label="" prop="password" borderBottom>
					<u-input v-model="ruleForm.password" type="password" placeholder="填写身份证号" border="none">
					</u-input>
				</u-form-item>

				<view class="ubtn">
					<u-button type="primary" text="进入人脸识别" @click="submit"></u-button>
				</view>
			</u-form>
		</view>
		<view class="dis-flex flex-x-center agreement">
			<u-checkbox-group v-model="checked"><u-checkbox :name="true" activeColor="#000"
					shape="circle"></u-checkbox></u-checkbox-group>我已阅读并同意<text @click="toAgree()">《实名认证服务协议》</text>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'authentication', // 实名认证
		data() {
			return {
				checked: [false],
				ruleForm: {
					password: '',
					account: '',
				},
				errorType: 'toast',
				labelStyle: {
					color: '#6750F8',
				},
				rules: {
					account: [{
							required: true,
							message: '请输入账号',
							trigger: ['change', 'blur'],
						},
						// {
						// 	// 自定义验证函数，见上说明
						// 	validator: (rule, value, callback) => {
						// 		// 上面有说，返回true表示校验通过，返回false表示不通过
						// 		return uni.$u.test.mobile(value);
						// 	},
						// 	message: '手机号码不正确',
						// 	// 触发器可以同时用blur和change
						// 	trigger: ['change', 'blur'],
						// }
					],
					password: {
						type: 'string',
						required: true,
						message: '请输入身份证号',
						trigger: ['blur', 'change']
					}
				},
			}
		},
		onLoad() {

		},
		onReady() {
			this.$refs.uForm.setRules(this.rules)
		},
		methods: {
			toAgree() {
				uni.navigateTo({
					url: "/pages/login/agreement?type=realname"
				})
			},
			radioChange(e) {
				console.log(e);
			},

			submit() {
				this.$refs.uForm.validate().then(res => {

				}).catch(errors => {
					console.log(errors)
				})

			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		width: 100vw;
		height: 100vh;
		background: #fff;

		.box {
			padding: 235rpx 100rpx 0;

			.register_txt {
				font-size: 42rpx;
				color: $uni-text-color;
				font-weight: bold;
			}

			.desc {
				margin-top: 45rpx;
				font-size: 26rpx;
				color: $uni-text-color-grey;
				line-height: 36rpx;
			}

			.uForm {
				margin-top: 100rpx;

				.ubtn {
					margin-top: 70rpx;

					/deep/ .u-button--primary {
						border-radius: 86rpx;
					}

				}
			}
		}

		.agreement {
			margin-top: 40rpx;

			text {
				color: $uni-text-color-inverse;
			}
		}
	}
</style>